<template>
    <div class="page-sub-category">
        <van-nav-bar
            title="Sub Category"
            left-arrow
            @click-left="onClickSubCategory"
            right-text="Next"
            @click-right="$router.push({path:'/sell'})"
        />

        <van-collapse v-model="activeNames" >
            <van-collapse-item :class="{isShowIcon: !(item.children.length > 0)}" v-for="item in subCategory" :title="item.name" :name="item.id"
                               :key="item.id" @click.native="onHandleSubCategory(item)">
                <van-button v-if="item.children.length>0" style="margin: 0 8px 8px 0;" type="default"
                            size="normal"
                            v-for="i in item.children" :key="i.id" @click="onHandleThirdLevelCategory(item, i)">
                    {{i.name}}
                </van-button>
            </van-collapse-item>
        </van-collapse>

        <div style="padding:40px;"></div>
        <footer-bar ref="footer" footerBar=""></footer-bar>

    </div>
</template>

<script>
    // 英文json
    import categoryJson from '../static/json/category'

    // 缅甸文json
    import mm_categoryJson from '../static/mmJson/category'

    // 缅甸unicode
    import mmu_categoryJson from '../static/mmUnicodeJson/category'
    import FooterBar from '@/components/FooterBar'
    function setState(store) {
    }

    export default {
        name: 'subcategory',
        metaInfo: {
            title: 'subcategory',
            titleTemplate: '%s',
            meta: [
                {name: 'keywords', content: 'lavas PWA'},
                {name: 'description', content: '基于 Vue 的 PWA 解决方案，帮助开发者快速搭建 PWA 应用，解决接入 PWA 的各种问题'}
            ]
        },
        async asyncData({store, route}) {
            setState(store);
        },
        components: {
            FooterBar
        },
        data() {
            return {
                // categoryJson: categoryJson,
                categoryId: '',
                nvaTitle: '',
                activeNames: ['1'],
            };
        },
        computed: {
            subCategory() {
                // 设置当前子json  第二级 手风琴dom
                for (let i = 0; i < this.categoryJson.length; i++) {
                    if (this.$route.query.id == this.categoryJson[i].id) {
                        return this.categoryJson[i].children || [];
                    }
                }
            },
            categoryJson() {
                if (this.$store.state.store.localLang == 'MM') {
                    return mm_categoryJson
                } else if (this.$store.state.store.localLang == 'MMU') {
                    return mmu_categoryJson
                } else {
                    return categoryJson
                }
            },
        },
        methods: {
            onClickLeft() {
                this.$router.push('/category')
            },
            onHandleSubCategory(item) {
                console.log(item)
                // 如果父级是service且没有三级目录 则跳转到sellservice页面
                if(item.id==337||item.id==345||item.id==346||item.id==347||item.id==348){
                    let value=[]
                    if (!item.children.length > 0) {
                        if(item.properties[0]){
                            if(item.properties[0].values){
                                value=item.properties[0].values
                            }
                        }
                        this.$router.push({
                            path: '/sell-rest/sell-service',
                            query: {
                                id: item.id,
                                categoryText: this.$route.query.categoryText + '/' + item.name,
                                values:value
                            }
                        })
                    }
                }
                // 如果父级是cars for sell(227) 则跳转到sellcar页面
                // else if(item.id==227){
                //     this.$router.push({
                //         path: 'sell-rest/sell-car',
                //         query: {
                //             id: item.id,
                //             categoryText: this.$route.query.categoryText + '/' + item.name,
                //         }
                //     })
                // }
                //父级不是service就正常跳到sell页面
                else  {
                    if(!item.children.length > 0){
                        this.$router.push({
                            path: '/sell',
                            query: {
                                id: item.id,
                                categoryText: this.$route.query.categoryText + '/' + item.name,
                            }
                        })
                    }
                }
                // else{
                //     // 如果父级为property 则跳转到别的网页
                //     if (item.id == 372) {  // rent
                //         location.href = 'https://bestproperty.com.mm/webPhone/index.html#/rent';
                //         return;
                //     } else if (item.id == 374) { // sale
                //         location.href = 'https://bestproperty.com.mm/webPhone/index.html#/buy';
                //         return;
                //     } else if (item.id == 376) { // Hostel
                //         location.href = 'https://bestproperty.com.mm/webPhone/index.html#/hostel';
                //         return;
                //     } else if (item.id == 378) { // New Development
                //         location.href = 'https://bestproperty.com.mm/webPhone/index.html#/newDevelopment';
                //         return;
                //     }
                //
                //
                // }
            },
            onHandleThirdLevelCategory(item, i) {
                // 如果是home service
                if(item.id==337){
                    let value=[]
                        if(i.properties[0]){
                            if(i.properties[0].values){
                                value=i.properties[0].values
                            }
                        }
                    this.$router.push({
                        path: '/sell-rest/sell-service',
                        query: {
                            id: i.id,
                            categoryText: this.$route.query.categoryText + '/' + item.name + '/' + i.name,
                            values:value
                        }
                    })
                }
                else{
                    this.$router.push({
                        path: '/sell',
                        query: {
                            id: i.id,
                            categoryText: this.$route.query.categoryText + '/' + item.name + '/' + i.name,
                        }
                    })
                }
            },
            onClickSubCategory() {
                this.$router.go(-1)
            }
        },
        mounted() {

            // 动态展示当前的title
            if (this.$route.query.categoryText) {
                this.nvaTitle = this.$route.query.categoryText;
                this.categoryId = this.$route.query.id;

                // 设置当前子json  第二级 手风琴dom
                for (let i = 0; i < this.categoryJson.length; i++) {
                    if (this.categoryId == this.categoryJson[i].value) {
                        this.subCategory = this.categoryJson[i].child;
                    }
                }

            }

        },
    };
</script>

<style>
    .isShowIcon .van-icon{
        display: none!important;
    }
</style>

